<template>
  <div class="couponView pd-20">
    <div class="detailView">
      <div class="detail">
        <div class="name">创建时间</div>
        <div class="value">{{commonFunction.timeFormat(item.createTime).hasHMS}}</div>
      </div>
      <div class="detail">
        <div class="name">名称</div>
        <div class="value">{{item.name}}</div>
      </div>
      <div class="detail">
        <div class="name">截止日期</div>
        <div class="value">{{commonFunction.timeFormat(item.validDate).hasHMS}}</div>
      </div>
      <div class="detail">
        <div class="name">优惠类型</div>
        <div class="value">{{item.couponType | couponType}}</div>
      </div>
      <div class="detail">
        <div class="name">订单金额</div>
        <div class="value">{{item.orderMoney}}</div>
      </div>
      <div class="detail">
        <div class="name">优惠券数量</div>
        <div class="value">{{item.couponNum}}</div>
      </div>
      <div class="detail">
        <div class="name">有效天数</div>
        <div class="value">{{item.validDay}}</div>
      </div>
      <div class="detail">
        <div class="name">图片</div>
        <div class="value">
          <img :src="item.image"
               alt="图片"
               preview="bannerView">
        </div>
      </div>
      <div class="detail">
        <div class="name">备注</div>
        <div class="value">{{item.remark}}</div>
      </div>
    </div>
    <div class="operationView mt-20">
      <el-button type="primary"
                 @click="handleUpdate">修 改</el-button>
      <el-button type="danger"
                 @click="handleDel">删 除</el-button>
      <el-button type="primary"
                 plain
                 @click="handleGoPage">返 回</el-button>
    </div>
  </div>
</template>

<script>
  import { activityMgt } from '@/api/codeName'
  export default {
    name: "couponView",
    data () {
      return {
        item: {}
      }
    },
    mounted () {
      this._getViewById()
    },
    methods: {
      handleUpdate () {
        this.$router.push({ name: 'couponUpdate', query: { id: this.item.id } })
      },
      handleDel () {
        this.$Modal.confirm({
          title: '确认',
          content: '<p>您确认删除该优惠券？</p>',
          onOk: () => {
            this.ajax({
              type: this.api.couponDel.type,
              url: this.api.couponDel.url,
              isSubmit: true,
              data: {
                id: this.item.id,
              },
              success: (data) => {
                this.$Message.success(data);
                this.$router.back(-1)
              },
              error: (data) => {
                this.$Message.error(data.message);
              }
            })
          },
          onCancel: () => { }
        });
      },
      _getViewById () {
        this.ajax({
          type: this.api.couponView.type,
          url: this.api.couponView.url,
          data: {
            id: this.$route.query.id
          },
          success: (data) => {
            this.item = data.object
            this.$previewRefresh()
          },
          error: (data) => {
            this.$Message.error(data.message);
          }
        })
      },
      handleGoPage () {
        this.$router.push({ name: 'couponList' })
      }
    },
    filters: {
      couponType: (value) => {
        for (let i = 0; i < activityMgt.couponMgt.couponType.length; i++) {
          if (value == activityMgt.couponMgt.couponType[i].code) {
            return activityMgt.couponMgt.couponType[i].name
          }
        }
        return value
      }
    }
  }
</script>

<style lang="scss" type="text/scss" rel="stylesheet/scss">
  .couponView {
  }
</style>
